<template>
 <div class="content">
    <div class="header">
        装备故障树模型系统
  </div>
  <div class="body">
    <el-col v-for="item,index in carType" :key="index" :span="6" class="card">
      <router-link to="/" @click="test(item)">
        <el-card shadow="hover">
          {{ item }}
        </el-card>
      </router-link>
    </el-col>
 </div>
 </div>
</template>

<script>
export default {
  data () {
    return {
      carType: ['RCT804', 'RCT809-1', 'RCT809-2']
    }
  },
  methods: {
    test (item) {
      if (localStorage.getItem('type')) {
        localStorage.clear()
        console.log(1)
      }
      console.log(item)
      localStorage.setItem('type', item)
      this.$router.push('/')
    }
  }
}
</script>

<style lang="scss" scoped>
.content{
    .header{
        background-color: #409eff;
        color: #fff;
        text-align: center;
        line-height: 60px;
        font-size: 23px;
    }
    .body{
        margin: 1rem 0rem 1rem 10rem;
        font-size: 1.7rem;
        .card{
          margin: 2rem 3rem;
        }
        .el-card{
        height: 7rem;
        display: flex;
        align-items: center;
        justify-content: center;
      }
     }
}
</style>
